<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>layout布局</title>
<!-- 引入jQuery.js文件 -->
<script type="text/javascript" src="static/bootstrap/jquery.js"></script>
<link rel="stylesheet"href="static/jquery-easyui-1.4.1/themes/default/easyui.css">
<!-- 引入easyui小图标文件  -->
<link rel="stylesheet" href="static/jquery-easyui-1.4.1/themes/icon.css">
<script type="text/javascript"src="static/jquery-easyui-1.4.1/jquery.easyui.min.js"></script>
<script type="text/javascript"src="static/jquery-easyui-1.4.1/locale/easyui-lang-zh_CN.js"></script>
<script type="text/javascript">
	$(function(){
		$('a[title]').click(function(){
			var src = $(this).attr('title'); //得到路径
			var title = $(this).html(); //取a标签的文本值
			if($('#tt').tabs('exists',title)){ //判断选项卡是否存在
				$('#tt').tabs('select',title); //存在时直接选中该选项卡
			}else { //不存在时再动态生成
				$('#tt').tabs('add',{    
				    title:title, //动态生成标签头
				    content:'<iframe frameborder=0 style="width:100%;height:99%;" src='+ src +' ></iframe>', //动态生成选项卡内容 
				    closable:true //可关闭      
				}); 
			} 
		});
	});
</script>
</head>
<body>
	<div id="cc" class="easyui-layout" fit=true style="width: 100%;height: 100%;">   
	    <div data-options="region:'north',title:'顶部',split:true" style="height:100px;"></div> 
	    <!--  
		    <div data-options="region:'south',title:'底部',split:true" style="height:100px;"></div>   
		    <div data-options="region:'east',iconCls:'icon-reload',title:'右边',split:true" style="width:100px;"></div> 
	    -->    
	    <div data-options="region:'west',title:'菜单',split:true,iconCls:'icon-ok'" style="width:200px;">
	    	<div id="aa" class="easyui-accordion" tif=true>   
			    <div title="用户管理" style="overflow:auto;padding:10px;">
			    	<a title="001">添加学生</a><br/>
			    	<a title="003">学生信息管理</a>
			    </div>   
			    <div title="岗位管理" style="padding:10px;">   
			    </div>   
			    <div title="权限管理">   
			    </div>   
			</div>  
	    </div>   
	    <div data-options="region:'center'" style="padding:5px;background:#eee;">
	    <div id="tt" class="easyui-tabs" fit="true" style="width: 500px;height:250px;">
		   		<div title="首页" data-options="href:'/',closable:false,iconCls:'icon-tip',cls:'pd3'"></div>
		    </div>     	
	    </div>   
	</div>  
</body>
</html>